<script>
	export default {
		onLaunch: function() {
			console.log('App Launch')
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>

<style>
	/*每个页面公共css */
	
	/* iOS全局样式规范 */
	page {
		font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', sans-serif;
		color: #000000;
		background-color: #f2f2f7;
		font-size: 14px;
		line-height: 1.4;
		--ios-blue: #007AFF;
		--ios-red: #FF3B30;
		--ios-green: #34C759;
		--ios-gray: #8E8E93;
		--ios-light-bg: #F2F2F7;
		--ios-card-bg: #FFFFFF;
		--ios-separator: rgba(60, 60, 67, 0.1);
		--ios-border-radius: 10px;
		--ios-small-radius: 8px;
		--ios-card-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
		--ios-pressed-effect: #EBEBEB;
	}
	
	/* 常见元素iOS样式 */
	button {
		border-radius: 10px;
		font-weight: 500;
		font-size: 15px;
		transition: all 0.2s ease;
		padding: 12px 20px;
	}
	
	button.primary {
		background: var(--ios-blue);
		color: #FFFFFF;
	}
	
	button.secondary {
		background: rgba(0, 122, 255, 0.1);
		color: var(--ios-blue);
	}
	
	input {
		background-color: rgba(0, 0, 0, 0.03);
		border-radius: 10px;
		padding: 12px 16px;
		font-size: 15px;
	}
	
	.ios-card {
		background-color: var(--ios-card-bg);
		border-radius: var(--ios-border-radius);
		padding: 16px;
		margin-bottom: 12px;
		box-shadow: var(--ios-card-shadow);
	}
	
	.ios-list {
		background-color: var(--ios-card-bg);
		border-radius: var(--ios-border-radius);
		overflow: hidden;
	}
	
	.ios-list-item {
		padding: 14px 16px;
		border-bottom: 0.5px solid var(--ios-separator);
		position: relative;
	}
	
	.ios-list-item:last-child {
		border-bottom: none;
	}
	
	.ios-list-item:active {
		background-color: var(--ios-pressed-effect);
	}
	
	.ios-list-item .arrow {
		position: absolute;
		right: 16px;
		top: 50%;
		transform: translateY(-50%);
		color: var(--ios-gray);
	}
	
	.ios-header {
		font-size: 34px;
		font-weight: 700;
		letter-spacing: -0.5px;
		margin-bottom: 20px;
	}
	
	.ios-subheader {
		font-size: 22px;
		font-weight: 600;
		margin-bottom: 16px;
	}
	
	.ios-section-title {
		font-size: 17px;
		font-weight: 500;
		margin: 24px 0 12px 0;
		color: #555;
	}
	
	.ios-nav {
		background-color: rgba(255, 255, 255, 0.85);
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		border-bottom: 0.5px solid var(--ios-separator);
		padding: 12px 16px;
		font-weight: 500;
		position: sticky;
		top: 0;
		z-index: 100;
	}
	
	.ios-tag {
		font-size: 12px;
		padding: 4px 8px;
		border-radius: 8px;
		margin-right: 6px;
		background-color: rgba(0, 0, 0, 0.05);
	}
	
	/* 动画效果 */
	.ios-transition {
		transition: all 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
	}
	
	.ios-fade-in {
		animation: fadeIn 0.2s forwards;
	}
	
	@keyframes fadeIn {
		from { opacity: 0; }
		to { opacity: 1; }
	}
	
	/* 暗黑模式支持 */
	@media (prefers-color-scheme: dark) {
		page {
			color: #FFFFFF;
			background-color: #000000;
			--ios-blue: #0A84FF;
			--ios-red: #FF453A;
			--ios-green: #30D158;
			--ios-gray: #98989F;
			--ios-light-bg: #1C1C1E;
			--ios-card-bg: #2C2C2E;
			--ios-separator: rgba(255, 255, 255, 0.15);
			--ios-pressed-effect: #3C3C3E;
		}
		
		.ios-nav {
			background-color: rgba(28, 28, 30, 0.85);
			border-bottom: 0.5px solid var(--ios-separator);
		}
	}

	/* 自定义tabbar样式 */
	.uni-tabbar {
		box-shadow: 0 -1px 10px rgba(0,0,0,0.05);
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		transition: all 0.3s ease;
	}

	/* 适配iOS环境的底部安全区 */
	.uni-tabbar .uni-tabbar__content {
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
	}

	/* 设置选中态下的图标和文字效果 */
	.uni-tabbar__item.uni-tabbar__item--active .uni-tabbar__icon,
	.uni-tabbar__item.uni-tabbar__item--active .uni-tabbar__label {
		font-weight: 600;
		transform: scale(1.1);
		transition: all 0.3s ease;
	}

	/* AI助手中间按钮的特殊样式 */
	.uni-tabbar__item:nth-child(3) .uni-tabbar__icon {
		transform: scale(1.15);
		transition: all 0.3s ease;
	}

	/* 设置图标与文字间距 */
	.uni-tabbar__icon {
		margin-bottom: 4px;
	}

	/* 优化标签文字 */
	.uni-tabbar__label {
		font-size: 11px;
		line-height: 1.2;
		letter-spacing: 0.2px;
		transition: all 0.3s ease;
	}
	
	/* 添加标签点击时的涟漪效果 */
	.uni-tabbar__item:active::after {
		content: '';
		position: absolute;
		top: 50%;
		left: 50%;
		width: 0;
		height: 0;
		background-color: rgba(0, 0, 0, 0.05);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		animation: ripple 0.4s ease-out;
	}
	
	/* 选中状态文字效果 */
	.uni-tabbar__item--active .uni-tabbar__label {
		text-shadow: 0 0 1px rgba(0, 122, 255, 0.2);
	}
	
	/* 适配深色模式 */
	@media (prefers-color-scheme: dark) {
		.uni-tabbar {
			background-color: rgba(30, 30, 30, 0.8) !important;
			border-top: 0.5px solid rgba(255, 255, 255, 0.1) !important;
		}
		
		.uni-tabbar__label {
			color: rgba(255, 255, 255, 0.6) !important;
		}
		
		.uni-tabbar__item--active .uni-tabbar__label {
			color: #0A84FF !important;
		}
	}
	
	/* 动画关键帧 */
	@keyframes ripple {
		0% {
			width: 0;
			height: 0;
			opacity: 0.5;
		}
		100% {
			width: 50px;
			height: 50px;
			opacity: 0;
		}
	}
</style>
